<template>
	<nav-header title="就业意向">
		<my-page ref="mypage" v-model="dataList" :height="system.screenHeight - system.statusBarHeight - 101" @load-data="loadData">
			<template slot="content">
				<view v-for="(item,index) in dataList" :key="index" class="bg-white p-4 flex items-center" :class="{'border-b-ee': index && index != dataList.length}">
					<u-checkbox-group v-model="item.checked" @change="chkboxChange($event, item.id)">
						<u-checkbox :name="item.id" shape="circle" activeColor="#2d58cb"></u-checkbox>
					</u-checkbox-group>
					<view class="pl-3 flex-1" @click="$util.myNavigateTo('/pages_home/jiuye_form?id=' + item.id)">
						<view class="flex items-center justify-between">
							<view>
								<text class="text-black-33 font-bold pr-1">#</text>
								<text class="text-black-33 text-lg font-bold" v-text="index + 1"></text>
							</view>
							<view class="flex items-center pl-3 pr-4 py-0_5 bg-theme rounded-full">
								<u-icon name="search" color="#ffffff" size="16"></u-icon>
								<text class="text-white text-sm">详情</text>
							</view>
						</view>
						<view class="flex items-center justify-between mt-3">
							<text class="text-gray-99 text-sm" v-text="$util.getFormatDate(item.createTime, 'yyyy-0m-0d 0h:0f')"></text>
							<text class="text-sm pr-4 text-red-500" @click.stop="del('single',item.id, index)">删除</text>
						</view>
					</view>
				</view>
			</template>
		</my-page>
		<view class="bg-theme text-white flex items-center justify-center mx-4 rounded-full" style="height: 45px;margin-bottom: 12px;"
			@click="()=>{
				if (selectList.length > 0) {
					del('all')
				}else {
					$util.myNavigateTo('/pages_home/jiuye_form')
				}
			}">
			<template v-if="selectList.length > 0">
				<text  v-text="'删除所选(' + selectList.length + ')'"></text>
			</template>
			<template v-else>
				<u-icon name="plus" color="#ffffff" size="16"></u-icon>
				<text class="pl-2">创建新的记录</text>
			</template>
		</view>
		<u-toast ref="uToast"></u-toast>
	</nav-header>
</template>

<script>
	import {mapState} from 'vuex'
	import MyPage from '@/components/my_page.vue'
	import NavHeader from '@/components/nav_header.vue'
	import * as intentionApi from '@/interface/junchuang/intention.js'
	import MescrollPageMixin from "@/uni_modules/mescroll-uni/components/mescroll-uni/mixins/mescroll-page.js"
	export default {
		mixins: [MescrollPageMixin],
		components: {
			NavHeader,MyPage
		},
		data() {
			return {
				dataList: [],
				checked: false,
				selectList: [],
				data: {pageTotal: 0},
			}
		},
		computed: {
			...mapState({
				system: state => state.system
			})
		},
		onPullDownRefresh () {
			this.$refs['mypage'].dataReload()
			uni.stopPullDownRefresh()
		},
		onShow () {
			// 新增或编辑返回后，刷新页面
			if (this.dataList.length > 0) this.dataReload()
		},
		methods: {
			loadData(page, success, error){
				const v = this;
				Object.assign(v.data, page)
				intentionApi.getIntentionPageList(v.data).then(res=>{
					v.data.pageTotal = res.data.total || 0
					res.data.rows.forEach(item=> {
						item.checked = []
					})
					success(res)
				}).catch(error)
			},
			del (id,index) {
				const v = this
				v.$util.showModal('提示', "是否删除该记录？", true, '确定', '取消', (res) => {
					intentionApi.deleteIntention(v.selectList).then(res=>{
						if (res.success) {
							v.$refs.uToast.show({
								message: "删除成功.",
								complete() {
									v.dataReload()
								}
							})
						}
					})
				}, (res) => {
					return
				})
			},
			chkboxChange (arr, id) {
				const v = this
				if (arr.length > 0) {// 勾选
					v.selectList.push(id)
				}else {// 移除
					if (v.selectList.includes(id)) {
						v.selectList.splice(v.selectList.indexOf(id), 1)
					}
				}
			},
			dataReload () {
				this.selectList = []
				this.$refs['mypage'].dataReload()
			}
		}
	}
</script>

<style>

</style>
